<template>
	<!-- 摘牌的采购单 -->
	<view class="content">
		<el-form ref="form" :model="parameter" label-width="80px" class="orderStatus">
			<el-form-item label="商品名称:">
				<el-input class="mr-2" v-model="parameter.Article_Name" style="width: 188px" placeholder="请输入商品名称"></el-input>
				<el-button @click="Query()" type="primary" size="small">查询</el-button>
			</el-form-item>

		</el-form>
		<view class="tabs orderStatus">
			<view v-for="(item, index) in orderStatus" :key="index" :class="{ viewfu: selectedIndex === index }"
				@click="toggleStatus(index)">{{ item }}</view>
		</view>

		<el-table border :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }"
			:data="tableData">
			<el-table-column prop="Article_Name" label="商品信息">
				<template v-slot="{row}">
					<el-tooltip effect="dark" :content="row.Article_Name" placement="top">
						<view class="text-ellipsis w-100">
							<text>{{row.Article_Name}}</text>
						</view>
					 </el-tooltip>
				</template>
			</el-table-column>
			<el-table-column prop="Enterprise_Name" label="所属企业">
				<template v-slot="{row}">
					<el-tooltip effect="dark" :content="row.Enterprise_Name" placement="top">
						<view class="text-ellipsis w-100">
							<text>{{row.Enterprise_Name}}</text>
						</view>
					 </el-tooltip>
				</template>
			</el-table-column>
			<el-table-column prop="Amount" label="商品价格">
				<template v-slot="{row}">
					<text>￥{{row.Amount}}</text>
				</template>
			</el-table-column>
			<el-table-column prop="Quantity" label="交易数量">
				<template v-slot="{row}">
					<text>{{row.Quantity}}{{row.Unit}}</text>
				</template>
			</el-table-column>
			<el-table-column prop="Trading_Name" label="付款方式">
				<template v-slot="{row}">
					<el-tooltip effect="dark" :content="row.Trading_Name" placement="top">
						<view class="text-ellipsis w-100">
							<text>{{row.Trading_Name}}</text>
						</view>
					 </el-tooltip>
				</template>
			</el-table-column>
			<el-table-column align="center" label="交易状态">
				<template v-slot="{row}">
					<text v-if="row.Row_Status=='0'&&row.Seller_Status=='0'">待对方审核</text>
					<text v-if="row.Row_Status=='2'&&row.Seller_Status=='0'">对方拒绝您的申请</text>
					<text v-if="row.Row_Status=='1'&&row.Seller_Status=='0'">待双方确认合同</text>
					<text v-if="row.Row_Status=='4'&&row.Seller_Status=='0'">待我方确认合同</text>
					<text v-if="row.Row_Status=='1'&&row.Seller_Status=='4'">待对方确认合同</text>
					<view v-if="row.Trading_Name!='全款'" class="">
						<text v-if="row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_0')&&row.Seller_Status=='4'">待对方付首款</text>
						<text v-if="row.Row_Status=='5'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_0')&&row.Seller_Status=='4'">待对方付首款</text>
						<text v-if="row.Row_Status=='5'&&row.Trading_Detail_SerialNumber.includes('T01000000000002_0')&&row.Trading_Detail_SerialNumber.includes('T01000000000001_1')">待对方付下一笔款</text>
						<text v-if="row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000003_0')&&row.Trading_Detail_SerialNumber.includes('T01000000000002_1')">待对方付下一笔款</text>
						<text v-if="row.Row_Status=='6'&&row.Trading_Detail_SerialNumber.includes('T01000000000004_0')&&row.Trading_Detail_SerialNumber.includes('T01000000000003_1')">待对方付尾款</text>
						<text v-if="row.Row_Status=='4'&&row.Seller_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_1')">待我方发货</text>
					</view>
					<view v-if="row.Trading_Name=='全款'">
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_0')">待对方付全款</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_1')">待我方发货</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000002_0')">待对方付全款</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000002_1')">待我方发货</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000003_0')">待对方付全款</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000003_1')">待我方发货</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000004_0')">待对方付全款</text>
						<text v-if="row.Seller_Status=='4'&&row.Row_Status=='5'">待对方收货</text>
					</view>
					<text v-if="row.Row_Status=='6'&&row.Seller_Status=='4'&&Number(row.Amount)*Number(row.Quantity)==Number(row.Collection_Amount)">交易结束</text>
				</template>
			</el-table-column>
			<el-table-column label="应付金额">
				<template v-slot="{row}">
					<text>￥{{(Number(row.Amount)*Number(row.Quantity)).toFixed(2)}}</text>
				</template>
			</el-table-column>
			<el-table-column label="已付金额">
				<template v-slot="{row}">
					<text>￥{{(Number(row.Collection_Amount)).toFixed(2)}}</text>
				</template>
			</el-table-column>
			<el-table-column label="未付金额">
				<template v-slot="{row}">
					<text>￥{{(Number(row.Amount)*Number(row.Quantity)-Number(row.Collection_Amount)).toFixed(2)}}</text>
				</template>
			</el-table-column>
			<el-table-column width="200" label="交易操作">
				<template v-slot="{row}">
					<el-button v-if="row.Row_Status!='2'&&row.Seller_Status!='0'" @click="LookDetail(row)" size="mini" type="info">详情</el-button>
					<el-button :loading="loading" @click="ConfirmContract(row)"
						v-if="(row.Row_Status == '1'||row.Row_Status=='4')&&row.Seller_Status!='4'" size="mini"
						type="success">确认合同</el-button>
					<el-button :loading="loading" @click="Consignment(row)"
						v-if="row.Row_Status == '4' && row.Seller_Status == '4' " size="mini"
						type="primary">发货</el-button>
				</template>
			</el-table-column>
		</el-table>
		<view class="flex justify-between mt-2">
			<view class="">

			</view>
			<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="form.page" :page-sizes="[1, 5, 10, 20]" :page-size="form.limit"
				layout="total, sizes, prev, pager, next, jumper" :total="total">
			</el-pagination>
		</view>
		<el-dialog title="发货信息" :visible.sync="dialogFormVisible">
			<el-form class="flex flex-column">
				<el-form-item label="运输方式">
					<text>{{group_seek_transaction_logistics.Transport_Type}}</text>
				</el-form-item>
				<el-form-item label="物流信息">
					<el-input style="width: 500px;" placeholder="请输入物流信息(如物流单号等)"
						v-model="group_seek_transaction_logistics.Transport_Explain" type="text"></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogFormVisible = false">取 消</el-button>
				<el-button :loading="loading" type="primary" @click="SureConfirm()">确 定</el-button>
			</div>
		</el-dialog>
	</view>
</template>

<script>
	const app = getApp()
	import {
		getGroupSeekTransactionAllAction
	} from "@/api/purchasedgoods.js";
	import {
		getSubtableInquiryOriginal,
		getEditAction
	} from "@/api/global.js";
	import {
		getGroupSeekProcureIDAction
	} from "@/api/group.js";
	import {
		Message,
		MessageBox,
		Alert
	} from 'element-ui'
	import times from '@/static/js/utils.js'
	export default {
		name: "goods_sold",
		data() {
			return {
				loading: false,
				total: 0,
				tableData: [],
				form: {
					name: "",
					region: "全部",
					date1: "",
					date2: "",
					delivery: false,
					type: [],
					resource: "",
					desc: "",
				},
				parameter: {
					Type: "0",
					Article_Name:'',
					Row_Status:'',
					Group_Seek_Purchase_SerialNumber: "",
					Enterprise_Info_SerialNumber: uni.getStorageSync("loginInfo").enterprise,
					page: 1, //页数
					limit: 5, //每页数据条数
				},
				orderStatus: [
					"全部",
					"待对方审核",
					"待对方付款",
					"待发货",
					"交易成功",
				],
				group_seek_transaction: {},
				group_seek_transaction_logistics: {
					Group_Seek_Logistics_SerialNumber: '', //主键
					Group_Seek_Transaction_SerialNumber: '', //交易流水号
					Transport_Type: '', //运输方式
					Transport_Explain: '' //说明
				},
				dialogFormVisible: false,
				selectedIndex: 0,
			};
		},
		methods: {
			handleCurrentChange(val) {
				this.parameter.page = val;
				this.purchasedGoods(this.parameter);
			},

			handleSizeChange(val) {
				this.parameter.page = 1
				this.parameter.limit = val
				this.purchasedGoods(this.parameter);
			},
			async purchasedGoods(data) {
				const res = await getGroupSeekTransactionAllAction({
					data,
				});
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url:'/pages/login/login?expire=1'
					})
				} else if (res.Status == 'success') {
					console.log(res)
					this.tableData = res.tableData;
					this.total = Number(res.limit);
				}
			},
			ConfirmContract(row) {
				this.loading = true
				uni.showLoading({
					title: '提交中...'
				})
				let obj = {
					// 采购信息表
					group_seek_transaction: {
						group_seek_transaction_paystages: {}
					}
				}
				let data = {
					Primary_Key: row.Group_Seek_Transaction_SerialNumber,
					JSONObject: JSON.stringify(obj),
					token: uni.getStorageSync('loginInfo').token,
				}
				this.getOriginala(data, row)
			},
			Consignment(row) {
				console.log(row)
				if (row.Trading_Detail_SerialNumber.includes('T01000000000001_0')&&row.Trading_Name!='全款'||row.Trading_Name=='全款'&&Number(row.Collection_Amount)==0) {
					MessageBox('对方还没有付款, 是否继续发货?', '提示',{
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning',
					}).then(()=>{
						let obj = {
							// 采购信息表
							group_seek_transaction: {
								group_seek_transaction_paystages: {}
							}
						}
						let data = {
							Primary_Key: row.Group_Seek_Transaction_SerialNumber,
							JSONObject: JSON.stringify(obj),
							token: uni.getStorageSync('loginInfo').token,
						}
						this.getOriginalb(data,row)
					}).catch(()=>{
						Message({
							message: '已取消',
							type: 'warning'
						})
					})
				}else{
					let obj = {
						// 采购信息表
						group_seek_transaction: {
							group_seek_transaction_paystages: {}
						}
					}
					let data = {
						Primary_Key: row.Group_Seek_Transaction_SerialNumber,
						JSONObject: JSON.stringify(obj),
						token: uni.getStorageSync('loginInfo').token,
					}
					this.getOriginalb(data,row)
				}
			},
			async GroupSeekProcureIDAction(data) {
				const res = await getGroupSeekProcureIDAction({
					data
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url: ''
					})
				} else if (res.Status == 'success') {
					console.log(res)
				}
			},
			async getOriginala(data, row) {
				const res = await getSubtableInquiryOriginal({
					data
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url: ''
					})
				} else if (res.Status == 'success') {
					console.log(res)
					this.group_seek_transaction = res.group_seek_transaction[0]
					this.group_seek_transaction.Submission_Time = times.nowtime()
					this.group_seek_transaction.Enterprise_Info_SerialNumber = row.Enterprise_Info_SerialNumber
					this.group_seek_transaction.Seller_Status = '4'
					let group_seek_message = {
						Group_Message_SerialNumber: "",
						Group_Seek_Transaction_SerialNumber: this.group_seek_transaction
							.Group_Seek_Transaction_SerialNumber,
						Cause: "确认合同",
						Submission_Time: times.nowtime(),
						Enterprise_Info_SerialNumber: uni.getStorageSync('loginInfo').enterprise,
						Seller_Type: "0"
					}
					let data = {
						Data: JSON.stringify({
							Modify: {
								group_seek_transaction: [this.group_seek_transaction]
							},
							Add: {
								group_seek_message: [group_seek_message]
							}
						}),
						token: uni.getStorageSync('loginInfo').token,
					}
					this.getEdit(data, '已确认合同')
				}
			},
			async getOriginalb(data, row) {
				const res = await getSubtableInquiryOriginal({
					data
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url: ''
					})
				} else if (res.Status == 'success') {
					console.log(res)
					this.group_seek_transaction = res.group_seek_transaction[0]
					this.group_seek_transaction_logistics.Transport_Type = row.Transport_Name
					this.group_seek_transaction_logistics.Group_Seek_Transaction_SerialNumber = row
						.Group_Seek_Transaction_SerialNumber
					this.dialogFormVisible = true
				}
			},
			async getEdit(data, message) {
				const res = await getEditAction({
					data
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url: ''
					})
				} else if (res.Status == 'success') {
					console.log(res)
					this.loading = false
					uni.hideLoading()
					Message({
						message,
						type: 'success'
					})
					this.dialogFormVisible = false
					this.purchasedGoods(this.parameter);
				}
			},
			SureConfirm() {
				if (this.group_seek_transaction_logistics.Transport_Explain == '') {
					Message({
						message: '请输入物流信息',
						type: 'error'
					})
					return
				}
				this.loading = true
				let group_message_buyer = {
					Group_Message_SerialNumber: "",
					Group_Transaction_SerialNumber: this.group_seek_transaction.Group_Transaction_SerialNumber,
					Cause: "已发货",
					Submission_Time: times.nowtime(),
					Enterprise_Info_SerialNumber: uni.getStorageSync('loginInfo').enterprise,
					Seller_Type: "0"
				}
				this.group_seek_transaction.Row_Status = '5'
				let data = {
					Data: JSON.stringify({
						Modify: {
							group_seek_transaction: [this.group_seek_transaction]
						},
						Add: {
							group_seek_transaction_logistics: [this.group_seek_transaction_logistics],
							group_message: [group_message_buyer]
						}
					}),
					token: uni.getStorageSync('loginInfo').token,
				}
				this.getEdit(data, '发货成功')
			},
			toggleStatus(index) {
				if(this.selectedIndex == index){
					return
				}
				this.selectedIndex = index;
				this.parameter.Row_Status = index
				if(index==0){
					this.parameter.Row_Status = ''
				}else if(index==1){
					this.parameter.Row_Status = 0
				}else if(index==2){
					this.parameter.Row_Status = 4
				}else if(index==3){
					this.parameter.Row_Status = 4
				}else{
					this.parameter.Row_Status = 6
				}
				this.purchasedGoods(this.parameter)
			},
			Query(){
				this.purchasedGoods(this.parameter)
			},
			LookDetail(row){
				uni.setStorageSync('detail',JSON.stringify(row))
				uni.navigateTo({
					url:'/pages/order/purchase-order-detail?Group_Seek_Transaction_SerialNumber='+row.Group_Seek_Transaction_SerialNumber+'&Group_Seek_Purchase_SerialNumber='+row.Group_Seek_Purchase_SerialNumber+'&a=1'
				})
			}
		},
		created() {
			this.purchasedGoods(this.parameter);
		},
	};
</script>

<style lang="scss" scoped>
	.content {
		padding: 40rpx;
		background-color: #fff;

		.el-form {
			display: flex;
			flex-wrap: wrap;
		}

		/deep/ .el-col-2 {
			margin: 0 20rpx;
			width: auto;
		}

		.search-operation {
			display: flex;
			align-items: center;
			justify-content: center;

			view {
				cursor: pointer;
				margin-right: 20rpx;
				padding: 20rpx 40rpx;
				border-radius: 20rpx;
				background-color: #39bf3e;
				color: #fff;
			}

			view:nth-child(2) {
				border: 1px solid #f5f5f5;
				background-color: #ffffff;
				color: black;
			}
		}

		.tabs {
			width: 100%;
			height: 88rpx;
			margin: 20rpx 0;
			background-color: #fff;
			display: flex;
			cursor: pointer;

			view {
				background-color: #fff;
				color: black;
				float: left;
				height: 88rpx;
				font-size: 28rpx;
				letter-spacing: 0.7px;
				padding: 24rpx 70rpx;
				box-sizing: border-box;
			}

			.viewfu {
				background-color: #45b035;
				color: #fff;
			}
		}

		.title {
			background: #f2f2f2;
			height: 80rpx;
			font-size: 28rpx;
			color: #333;
			letter-spacing: 0.7px;
			display: flex;

			.header-item {
				line-height: 80rpx;
				text-align: center;
			}
		}

		.foot {
			text-align: center;
			height: 80rpx;
		}

		.pagination {
			display: flex;
			justify-content: flex-end;
		}
	}
</style>